導(dǎo)讀:先說結(jié)論:絕大多數(shù)手機(jī)網(wǎng)站中面包屑導(dǎo)航?jīng)]有存在的必要。1.面包屑導(dǎo)航是什么,有什么作用? 面包屑導(dǎo)航是一種線性的導(dǎo)航方式,顯示方式是“主分類>一級(jí)分類>二級(jí)分類>三級(jí)分類
發(fā)表日期:2020-07-04
文章編輯:興田科技
瀏覽次數(shù):9913
標(biāo)簽:
最近正好關(guān)注了一下面包屑導(dǎo)航的問題,正好談?wù)勥@個(gè)問題!
先說結(jié)論:絕大多數(shù)手機(jī)網(wǎng)站中面包屑導(dǎo)航?jīng)]有存在的必要。
一、需求分析
1.面包屑導(dǎo)航是什么,有什么作用?
面包屑是一種“歷史記錄”的應(yīng)用方式,作用是幫助追溯來路、告訴訪問者他們目前在網(wǎng)站中的位置,以及如何返回。
面包屑導(dǎo)航是一種線性的導(dǎo)航方式,顯示方式是“主分類>一級(jí)分類>二級(jí)分類>三級(jí)分類>……>最終內(nèi)容頁面”這樣。
面包屑導(dǎo)航是判斷頁面在整個(gè)網(wǎng)站結(jié)構(gòu)中的位置的最好方法。它能誘惑首次訪問者在進(jìn)入一個(gè)頁面后去瀏覽整個(gè)網(wǎng)站,降低網(wǎng)站的總體跳出率;增加網(wǎng)站的內(nèi)部鏈接,提高用戶體驗(yàn)。
2..用戶在什么情況下需要用面包屑導(dǎo)航?
網(wǎng)站層級(jí)較多( 3 層及以上),內(nèi)容龐雜。主導(dǎo)航展示能力不足或者使用不便,無法滿足指引用戶的需求。
用戶不熟悉網(wǎng)站,他們需要直觀清晰地了解目前所處的位置,以及當(dāng)前頁面在整個(gè)網(wǎng)站中的位置、怎么回來。比如工信部官網(wǎng)有大量的新用戶訪問。
用戶有讀完某一頁面的下級(jí)頁面的需求。比如學(xué)生依次閱讀重要的學(xué)校官網(wǎng)通知。
用戶回到上一層級(jí)比較麻煩。比如容易誤操作、回退步驟多、缺乏上級(jí)頁面的快捷入口、或者用戶自身操作不便。
3.面包屑導(dǎo)航適合哪些網(wǎng)站使用?
面包屑導(dǎo)航適用于層級(jí)較深的網(wǎng)站,如果只有一級(jí)分類的話,通過主導(dǎo)航就已經(jīng)能夠起到快速定位的作用,扁平型架構(gòu)的網(wǎng)站就沒有使用面包屑導(dǎo)航的必要。
由于面包屑導(dǎo)航路徑是線性結(jié)構(gòu)的,即下一級(jí)分類必定只屬于上一級(jí)分類,因此網(wǎng)站內(nèi)容必須劃分得非常清晰,且不存在交叉。否則,面包屑導(dǎo)航的路徑是不唯一的,同一個(gè)分類可能出現(xiàn)在不同的路徑中,讓用戶感到困惑。
目前常見的該結(jié)構(gòu)網(wǎng)站包括門戶類、電子商務(wù)類等層級(jí)較深,且內(nèi)容的組織分類邏輯性強(qiáng),獨(dú)立不交叉的網(wǎng)站。
如圖,淘寶的二級(jí)頁面沒有面包屑,新浪在進(jìn)入財(cái)經(jīng)頻道后開始面包屑導(dǎo)航。
如圖,新浪房產(chǎn)和新浪體育在UI上有較大的區(qū)別,用戶很少會(huì)感到困惑。
從用戶需求的角度來講,大多數(shù)WAp站都沒有必要添加面包屑導(dǎo)航。
在pC端,使用面包屑導(dǎo)航的主要是新聞網(wǎng)站、電商網(wǎng)站、官方網(wǎng)站。但是新聞網(wǎng)站和電商網(wǎng)站的趨勢是變得更加“頻道化”。為了將網(wǎng)站的縱深控制在三四個(gè)頁面,分別做不同主題的垂直網(wǎng)站。
例如淘寶會(huì)將用戶分流到全球購、天貓超市、淘寶美妝等二級(jí)網(wǎng)站,而這些二級(jí)頁面和淘寶主站并不是非常緊密的連接;新浪也將用戶分流到新浪財(cái)經(jīng)、新浪新聞等網(wǎng)站,而不強(qiáng)調(diào)它們與門戶的從屬關(guān)系。事實(shí)上,它的每個(gè)子網(wǎng)站的界面都不同,采用不同的信息組織方式,更像是彼此獨(dú)立的網(wǎng)站。
在這種情況下,單一WAp站的層級(jí)自然變少了,不同的UI也提醒用戶分別處在門戶的不同頻道,添加面包屑的需求也就減少了。
二、用戶體驗(yàn)分析
1.用戶在使用手機(jī)網(wǎng)站時(shí)有哪些習(xí)慣?
時(shí)間更為碎片化。大多數(shù)時(shí)候,用戶沒精力系統(tǒng)閱覽整個(gè)網(wǎng)站的信息架構(gòu),WAp站隨之變得更為扁平化、垂直化
瀏覽速度快,停留時(shí)間短。用戶使用手機(jī)上WAp站時(shí),他們的下滑操作是很機(jī)械的,要不斷尋求新的視線著力點(diǎn),而且只會(huì)把視線落在有實(shí)際內(nèi)容的地方,導(dǎo)航作為輔助的功能一般退居其次。
注意力不集中。對WAp站而言,頁面內(nèi)容是否吸引、是否有“爆點(diǎn)”更加重要。用戶在使用手機(jī)時(shí)往往更容易喪失耐心,并且感受到冗余信息的困擾。所以應(yīng)該留足頁面內(nèi)容的空間,并把有用的東西排列好,除掉其他一切冗雜信息。
不停地被打斷。用戶隨時(shí)被電話微信吸引走注意力,所以會(huì)傾向于使用簡單粗暴的方式回退。跳出率有一個(gè)天花板,所以就更不應(yīng)該讓用戶停頓和學(xué)習(xí)怎么使用,不要讓他們困惑。
2. 其他的回溯方式是否具備足夠的替代性?
和手機(jī)返回鍵相比:比起使用面包屑導(dǎo)航,手機(jī)返回更方便、更深入人心。Android系統(tǒng)一般都給實(shí)體按鍵一個(gè)返回的功能,對用戶而言,只要在Android手機(jī)上,這個(gè)按鍵無論何時(shí)都是退回上層的意思。而iOS系統(tǒng)下,頁面左上角是預(yù)留的返回位置,沿用這種設(shè)計(jì)可以順利地契合用戶習(xí)慣。
和瀏覽器返回按鈕相比:瀏覽器返回更方便、更快捷,學(xué)習(xí)成本更低。手機(jī)瀏覽器(包括app內(nèi)嵌瀏覽器)都會(huì)有地址欄、收藏夾、返回鍵這些,在瀏覽WAp站頁面的過程中,底欄的返回鍵和頂欄的地址一直存在,用戶若要返回會(huì)首先使用瀏覽器的返回。
如圖,百度和UC瀏覽器都在底欄放置了前進(jìn)和后退按鈕。
而微信的內(nèi)嵌瀏覽器左上角有返回、關(guān)閉兩個(gè)按鈕;知乎的內(nèi)嵌瀏覽器底欄有后退、前進(jìn)兩個(gè)按鈕,同時(shí)頁面左上角可以退出內(nèi)嵌瀏覽器。
從用戶體驗(yàn)的角度來講,WAp站自身幾乎沒有必要添加面包屑導(dǎo)航。
絕大多數(shù)WAp站都將配合手機(jī)瀏覽器或App內(nèi)嵌瀏覽器使用,而幾乎所有的瀏覽器都會(huì)有很方便的回溯功能。
隨著大數(shù)據(jù)的發(fā)展,網(wǎng)頁的推薦已經(jīng)可以做到一定程度上貼近用戶,用戶更傾向于通過推薦內(nèi)容擴(kuò)展和接續(xù)閱讀行為而非回溯。
4G和Wi-Fi網(wǎng)絡(luò)的發(fā)展已經(jīng)大大提升移動(dòng)網(wǎng)絡(luò)的速度,用戶的的閱讀行為也隨之變得更加任性而并非中規(guī)中矩地沿一條路線查看。
社交網(wǎng)絡(luò)和分享功能的興盛讓我們越來越難以預(yù)測用戶是從何處進(jìn)入某個(gè)WAp頁面查看的,那么接續(xù)閱讀最好的方法是基于人際互動(dòng)的推薦(看過這篇文章的人也看過的、你的朋友也喜歡的、分享次數(shù)也很多的內(nèi)容)而非回溯上級(jí)頁面。
無論如何,WAp站的主導(dǎo)航依然存在,iOS等系統(tǒng)已經(jīng)可以做到輕觸回到頂部主導(dǎo)航處,能比較快捷地滿足用戶導(dǎo)航的需求。
三、網(wǎng)頁設(shè)計(jì)角度分析:
1.面包屑導(dǎo)航的設(shè)計(jì)原則與WAp站的設(shè)計(jì)原則有沖突
WAp站的頁面寬度較低,在WAp站的設(shè)計(jì)規(guī)范中,對每行字?jǐn)?shù)上限做了限定。現(xiàn)今大多數(shù)的網(wǎng)站一行字?jǐn)?shù)上限為 14 個(gè)中文字符
面包屑導(dǎo)航只能逐層降級(jí),不可跳級(jí),文字必須橫排排列,且不可以省略字?jǐn)?shù)和符號(hào)。一旦層級(jí)較多就很容易超限,但如果層級(jí)很少,又沒必要使用面包屑。
展示在手機(jī)屏幕的WAp站首屏頁面非常珍貴,寸土寸金,應(yīng)該把更多空間交給引爆用戶的內(nèi)容而不是輔助型的導(dǎo)航
面包屑導(dǎo)航條只能出現(xiàn)在頁面頭部和尾部,但手機(jī)瀏覽器的上下部分已經(jīng)預(yù)留了按鍵:頭部有回退按鈕,尾部有回退按鈕或手機(jī)按鍵,所以面包屑導(dǎo)航條的必要性大大降低了
面包屑導(dǎo)航需要持續(xù)使用,但只對三級(jí)頁面有較大的意義,相對成本高
面包屑導(dǎo)航不應(yīng)該過于顯眼,一般都比較小,但是手機(jī)字體本來就比較小,繼續(xù)變小的話,點(diǎn)按會(huì)變得十分困難,太大又會(huì)占用過多的地方
2.不適合使用面包屑的WAp站:
新聞?lì)?、電商類網(wǎng)站:目前多采用分頻道的方式區(qū)分二級(jí)站點(diǎn)和主站,減少層級(jí),努力做到結(jié)構(gòu)上的扁平化
社交類網(wǎng)站:結(jié)構(gòu)一般都比較扁平,層次也比較清晰,功能點(diǎn)較少不需要指引
知識(shí)類、生活類網(wǎng)站:一般使用站點(diǎn)地圖來體現(xiàn)整個(gè)站點(diǎn)的結(jié)構(gòu),如同pC端一樣,他們更注重展示與內(nèi)容,較少采用面包屑
3.政府網(wǎng)站、官方網(wǎng)站:適合使用面包屑導(dǎo)航。
查看政府網(wǎng)站和官方網(wǎng)站的人一般是新用戶,不夠了解該網(wǎng)站
這些網(wǎng)站由于是 to B 的項(xiàng)目,其信息架構(gòu)會(huì)受到乙方的較大干涉,會(huì)出現(xiàn)各不相同的狀態(tài),就更容易讓用戶感到困惑
官網(wǎng)的內(nèi)容量比較少而且穩(wěn)定,并不會(huì)像媒體類、電商類網(wǎng)站有海量信息,也不像UGC網(wǎng)站有許多用戶自擬的標(biāo)簽。WAp設(shè)計(jì)者可以對之保持較高的控制力,將層級(jí)保持在合理的范圍內(nèi)
面包屑導(dǎo)航條利于搜索引擎優(yōu)化,百度蜘蛛直接沿著導(dǎo)航鏈走就可以了,能更好地對網(wǎng)站內(nèi)容進(jìn)行抓取。而Google已經(jīng)將面包屑導(dǎo)航整合到搜索結(jié)果里面,因此添加面包屑有利于官網(wǎng)的推廣,對企業(yè)是有好處的
綜上所述,除官方網(wǎng)站、政府網(wǎng)站之外,其他大多數(shù)WAp站沒有必要添加面包屑導(dǎo)航。
作者:淺野早苗
來源:知乎
鏈接:https://www.zhihu.com/question/19760227/answer/58054143
上一篇:
暫無信息更多新聞
2020
關(guān)于網(wǎng)站建設(shè),您不僅可以用文字、圖片、動(dòng)畫等方式宣傳自己的產(chǎn)品,而且可以介紹自己的企業(yè),發(fā)布企業(yè)新聞,介紹企業(yè)領(lǐng)導(dǎo),公布公司業(yè)績,提供售后服務(wù),舉辦產(chǎn)品
View details
2020
關(guān)于網(wǎng)站建設(shè),DIY自助建站工具(站長工具),主要是通過使用模板和內(nèi)容管理系統(tǒng)來建設(shè)及更新網(wǎng)站。使得網(wǎng)站建設(shè)與維護(hù)都變得容易起來。許多主機(jī)服務(wù)提供商都
View details
2020
2018年最火項(xiàng)目 電銷機(jī)器人等你加盟最近給網(wǎng)站替換了一個(gè)模板,新的模板界面看起來很簡單,整體的瀏覽體驗(yàn)也讓人很舒服。不過在模板替換完成后,發(fā)現(xiàn)了一個(gè)問題——網(wǎng)
View details
2020
關(guān)于網(wǎng)站建設(shè),下面小編告訴大家怎樣來提高網(wǎng)站建設(shè)的權(quán)重? 1標(biāo)題:確保網(wǎng)站每一個(gè)標(biāo)題的唯一性也是網(wǎng)站優(yōu)化者必須注重的,只有唯一性才能給你的網(wǎng)站帶來
View details